<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="${shopPo.id!}" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>${(session.session_shop.name)!}</title>
<link href="/css/common.css" type="text/css" rel="stylesheet" />
<link href="/css/index.css" type="text/css" rel="stylesheet" />
<link href="/css/icons.css" type="text/css" rel="stylesheet" />
<link href="/css/product.css" type="text/css" rel="stylesheet" />
<link href="/css/ucenter.css" type="text/css" rel="stylesheet" />
<link href="/css/add2home.css" type="text/css" rel="stylesheet" />


<link href="/css/subpages.css" type="text/css" rel="stylesheet" />
<script src="/js/jquery-1.11.0.min.js" type="text/javascript"></script>
<!-- <script src="/js/geo.js" type="text/javascript"></script> -->
<script>
//这个函数是必须的，因为在geo.js里每次更改地址时会调用此函数 

var shop = "shop_${shopPo.id!}";
var shopCart = "shopcart_${shopPo.id!}";
var front_money = "${(session.session_shop.front_money)!0}";//"${shopPo.front_money!}";
function promptinfo() 
{ 
	var address = document.getElementById('address'); 
	var s1 = document.getElementById('s1'); 
	var s2 = document.getElementById('s2'); 
	var s3 = document.getElementById('s3'); 
	address.value = s1.value + s2.value + s3.value; 
} 

function sendTime(){
	var naoTime = new Date();
	var nowHour = naoTime.getHours();
	var options = "";
	for (var i = nowHour + 1; i < 24; i++){
		options = options + "<option value='" + i + "'>" + i + "时</option>"
	}
	$("#so_v_sel_hour").html(options);
	$("#so_v_sel_min").removeAttr("disabled");
}

</script>
<style>
#ticket {
	
}
.price_input{
	border:0;width:50px;color: red;font-weight: bold;padding-bottom: 5px;
}
.front_price_input{
	/*border-bottom:1 solid black;huerreson:expression_r(this.width=this.scrollWidth);*/
}
</style>

</head>
<!-- onload="setup();preselect('北京市');promptinfo();" -->
<body onload="sendTime();">
	<div id="main">

		<header class="main-header">
			<h1 class="">
				<a href="/shop/${shopPo.id!}">${(session.session_shop.name)!}</a>
			</h1>
			<div class="list-head-title">
				<h2>&nbsp;</h2>
			</div>
			<div class="top-shortcuts">
				<ul>
					<li class="ucenter"><a href="/customer">用户中心</a></li>
					<li class="cates"><a href="/menu/categories">全部分类</a></li>
					<li class="cart" id="shoppingcart"><a href="/cart/view/${shopPo.id!}">购物车</a></li>
				</ul>
			</div>
		</header>

		<header class="cfm-addr-bar">
			<span>收货人：</span>
			<div class="cart-total">
				
				<p class="addr-name">${(addr.consignee)!} ${(addr.phone)!}</p>
				<p class="addr-details">${(addr.address)!}</p>
				<input type="hidden" id="addr-addressid" name="addr-addressid" value="${(addr.id)!}"></input>
				<input type="hidden" id="addr-name" name="addr-name" value="${(addr.consignee)!}"></input>
				<input type="hidden" id="addr-address" name="addr-address" value="${(addr.address)!}"></input> 
				<a class="edit-addr-btn" href="javascript:void(0);">触摸修改地址</a>
			</div>
		</header>
		<section id="order-details">
			<div id="cfm-details">
				<!-- 配送/支付方式确认 -->
				<section class="cfm">
					<div class="express-cfm cfmoptions">
						<span>配送方式</span>
						<div class="select-box">
							<select id="shoppingmethods">
								<option value="0,0,0" selected>选择配送方式</option>
								<#list postageList as x>
								<option value="${x.id!},${x.name!},${x.price!}">${x.name!}</option>
								</#list>
							</select>
						</div>
					</div>
					<div class="express-cfm cfmoptions">
						<span>支付方式</span>
						<div class="select-box">
							<select id="paymethods" name="order.payment">
								<option value="" selected>选择支付方式</option>
								<option value="0">在线支付</option>
								<option value="1">货到付款</option>
								<!-- <option value="2">定金支付</option> -->
							</select>
						</div>
					</div>
					<div class="express-cfm cfmoptions">
						<span>配送时间</span>
						<div class="select-box">
							<select id="so_v_sel_min" disabled="disabled" style="width:78px;height:23px;">
								<option value="00" selected="selected">00分</option>
								<option value="15">15分</option>
								<option value="30">30分</option>
								<option value="45">45分</option>
								<option value="60">60分</option>
							</select>
						</div>
						
						<div class="select-box">
							<select style="width:80px;height:23px;" id="so_v_sel_hour"  onfocus="sendTime()">
							</select>
						</div>
					</div>
					<div class="express-cfm cfmoptions">
						<span>需要发票</span>
						<div style="float: right; border-radius: 4px; position: relative; overflow: hidden;  ">
							<div style="float:left;width:95px;" onclick="{document.getElementById('so_v_aa').checked=true;}"><input id="so_v_aa" type="radio" class="regular-radio" value="1" name="fapiao" checked><label for="so_v_aa"></label>是</div>
							<div style="float:left;width:95px;" onclick="{document.getElementById('so_v_bb').checked=true;}"><input id="so_v_bb" type="radio" class="regular-radio" value="0" name="fapiao" ><label for="so_v_bb"></label>否</div>
						</div>
					</div>
					<!-- <div class="pay-options">
						<p>
							<input type="checkbox" id="usetickets" /><label for="usetickets">是否使用优惠卷</label>
						</p>

					</div>
					<div id="ticket" class="ticket-cfm cfmoptions">
						<span>优惠券</span>
						<div class="cfm-info">
							<p>满100-5</p>
							<p class="cfm-detail">有效期：2013-12-09</p>
						</div>
					</div> -->
				</section>
				<section class="cfm">
					<input type="text" id="cfm-message" name="order.remark" placeholder="若您对订单有特殊要求，可在此备注"></input>
				</section>
				<!-- 配送/支付方式确认end -->
				<!-- 商品列表 -->
				<section class="cfm">
					<header class="cfm-list-tit">商品列表</header>
					<!-- <input type="text" id="product_param" name="product_param" value="${productParams!}" /> -->
					<div class="cfm-list-inner">
						<#list productList as x>
						<dl>

							<dt>
								<img src="http://adm.smpay.cn${x.proPo.logo!}" onerror="this.src='/images/default.png'" alt=""></img>
							</dt>
							<dd>
								<p>
									${x.proPo.name!}<!-- (<span style="color: orange; font-weight: bold;">团购</span>) -->
								</p>
								<p class="goods-prices">
									共<b>${x.product_num!}</b>件 x <span>￥${x.proPo.now_price!}</span> = <span><strong>￥${x.product_total!}</strong></span>
								</p>
								<p style="color: #e49040">
									${x.proPo.desc!}
								</p>
							</dd>
						</dl>
						</#list>
					</div>
					<div class="cfm-total">
						<dl>
							<dt>商品总价：</dt>
							<dd>￥<input id="gds_total" name="gds_total" value="${subTotal!}" class="price_input" readonly="readonly"/></dd>
						</dl>
						<dl>
							<dt>运费：</dt>
							<dd>￥<input id="shopping_total" name="order.postage" value="0" class="price_input" readonly="readonly"/></dd>
						</dl>
						<!-- dl>
							<dt>折扣：</dt>
							<dd>
								<span class="price-off" id="discount_total"></span>
								<input id="discount_total" name="discount_total" value="0" class="price_input"/>
							</dd>
						</dl -->
						<dl id="frontMoneyDL" style="display:none">
							<dt>预付定金：</dt>
							<dd>
								￥<input id="front_money" name="order.front_money" value="0" class="price_input" readonly="readonly"/>
							</dd>
						</dl>
						<dl class="price-total">
							<dt>合计：</dt>
							<dd>
								￥<input id="total" name="order.all_money" value="${subTotal!}" class="price_input" readonly="readonly"/>
							</dd>
						</dl>
					</div>
				</section>
				<!-- 商品列表end -->
			</div>

			<!-- 结算按钮 -->
			<section class="layout-m gotobill mt20 mb20">
				<a href="javascript:void(0);" id="gotopay">提交订单</a>
			</section>
		</section>
		<section id="address-list" class="cfm-popbox">
			<div id="list">
			</div>
			<form name="aspnetForm" method="post" action=""
				id="aspnetForm" class="create-new-addr" onsubmit="return false;">
				<input type="hidden" id="address" name="address"></input>
				<div></div>

				<p>
					<input type="text" id="new-addr-name" name="addr-name" value="" placeholder="姓名"></input>
				</p>
					
				<!-- <div style="float: left; padding-right: 3%; padding-bottom: 10px;">
					<select id="s1" name="sltStateProvince"
						style="width: 80px; padding-right: 0; margin-right: 0;">
						<option>请选择</option>
					</select>
				</div>
				<div style="float: left; padding-right: 3%;">
					<select id="s2" name="sltCity"
						style="width: 80px; padding-right: 0; margin-right: 0; padding-left: 0; margin-left: 0">
						<option Selected="Selected">请选择</option>
					</select>
				</div>
				<div style="float: left;">
					<select id="s3" name="sltCityArea"
						style="width: 80px; padding-left: 0; margin-left: 0">
						<option Selected="Selected">请选择</option>
					</select>
				</div> -->
				
				<div>
					<select  id="prov" name="sltStateProvince" disabled="disabled"></select>
					<select id="city" name="sltCity" disabled="disabled"></select>
					<select id="area" name="sltCityArea" disabled="disabled"></select>
				</div>
				
				<p>
					<input type="text" id="new-addr-address" value=""
						name="addr-detail" placeholder="详细地址" />
				</p>
				<p>
					<input type="text" id="new-addr-phone" name="addr-phone" value=""
						placeholder="手机号码" />
				</p>

				<p>
					<input type="submit" class="card-charge" id="new-address"
						value="新增" />
				</p>
			</form>


		</section>
		<!-- 优惠券选择 -->
		<!-- <div id="tks" class="ticket-cfm-box cfm-popbox">



			<div class="create-new-addr">
				<p class="box-title">输入优惠码获取优惠券</p>
				<p>
					<input type="text" placeholder="请填写优惠码" id="unpCode" />
				</p>
				<p>
					<a href="" class="create-new" id="new-ticket">新增</a>
				</p>
			</div>
		</div> -->
		<!-- 优惠券选择end -->

		<script src="/js/jquery.js" type="text/javascript"></script>
		<script src="/js/caichong_common.js" type="text/javascript"></script>
		<script src="/js/common.js" type="text/javascript"></script>
		<script type="text/javascript" src="/js/jsAddress.js"></script>

		<script>
		function setShoppingMethods(){
			var gds_total = $("#gds_total").val();
			var value = $("#shoppingmethods ").val()
			//alert(value);
            var opt = value.split(",") ;
            var postage = parseFloat(opt[2]);
            $("#shopping_total").val(postage);
            var all_money = parseFloat(gds_total) + postage;
            $("#total").val(all_money);
            
            //$("#shoppingmethods ").addAttr("disabled");
		}
		
		
        (function ($) {

        	addressInit("prov","city","area","广东","深圳市","宝安区");
            //$("#aspnetForm").hide();
            //var datauri = baseuri + "service/data.asmx/";
            //var orderuri = baseuri + "service/order.asmx/";
            var addresslist = $("#list");
			
            //点击显示收货地址选择列表
			var AddressChosenClick = function () {
			    
				$("#order-details").toggle();
			    $("#address-list").toggle();
			    //console.log("here")
			    addresslist.empty();
			    $.get("/submitOrders/getAddressList", function (data) {
			    	for(var i in data){
			    		var item = data[i]
			    		if(item.default==1){
			                var dom = '<dl data-name="' + item["consignee"] + '" data-phone="' + item["phone"] + '" data-address="' + item["address"] + '" data-addressid="' + item["id"] + '">'
			                + '<dt >收货人：' + item["consignee"] + '(' + item["phone"] + ')</dt>'
			                + '<dd>收货地址：' + item["address"] + '</dd></dl>';
			                addresslist.append(dom);
			       		}else{
			                   var dom = '<dl data-name="' + item["consignee"] + '" data-phone="' + item["phone"] + '" data-address="' + item["address"] + '" data-addressid="' + item["id"] + '">'
			                   + '<dt>收货人：' + item["consignee"] + '(' + item["phone"] + ')</dt>'
			                   + '<dd>收货地址：' + item["address"] + '</dd></dl>';
			                   addresslist.append(dom);
			           	}
			    	}
			    	$("DL", addresslist).bind("click", dlClick)
			    }).error(AjaxError);;
			    //$(this).unbind();
			}
			$(".cfm-addr-bar").click(AddressChosenClick);//点击动作
            
			
            var AddAddress = function (e) {
            	//alert("test");
				e.preventDefault();

                var name = $("#new-addr-name").val(), 
                	sltStateProvince = $("#prov").val(), 
                	sltCity = $("#city").val(),
                    sltCityArea = $("#area").val(), 
                    address = $("#new-addr-address").val(), 
                    phone = $("#new-addr-phone").val();
                //alert(name);
                if (name != '' && phone != '' && address != '' && sltCity != '' && sltCityArea != '' && sltStateProvince != '') {
                    $("#new-address").unbind().addClass("disable").val("保存中...")
                    $.post("/address/saveFrompay", { 
                    	"addr-name": name, 
                    	sltStateProvince: sltStateProvince, 
                    	sltCity: sltCity, 
                    	sltCityArea: sltCityArea, 
                    	"addr-detail": address,
                    	"addr-phone": phone }, 
                    	function (result) {
	                        if (result.Msg === 'Ok') {
	                            var item = result.md;
	                            var dom = '<dl data-name="' + item["consignee"] + '" data-phone="' + item["phone"] + '" data-address="' + item["address"] + '" data-addressid="' + item["id"] + '">'
	                    		+ '<dt>收货人：' + item["consignee"] + '(' + item["phone"] + ')</dt>'
	                    		+ '<dd>收货地址：' + item["address"] + '</dd></dl>';
	
	                            addresslist.append(dom);
	                            $("DL", addresslist).click(dlClick);
	                            $("#new-addr-name").val("");
	                            $("#new-addr-address").val('');
	                            $("#new-addr-phone").val('');
	
	                        }
	                        $("#new-address").click(AddAddress).removeClass("disable").val("新增")
                    }).error(AjaxError);
                } else {
                    var input = $(this).parents("P").siblings("P").find("INPUT[type='text']");
                    input.each(function () {
                        if (!$(this).val().length) {
                            var t = $(this);
                            var i = 0;
                            var warnmsg = setInterval(function () {
                                if (i > 12) {
                                    clearInterval(warnmsg);
                                }
                                t.parent("P").toggleClass("warn-input");
                                i++;
                            }, 400)
                            $(this).focus();
                            return false;
                        }
                    })
                }
            }
			
            var dlClick = function (e) {
                e.preventDefault();
                var name = $(this).data("name"), phone = $(this).data("phone"), address = $(this).data("address"),
                    addressid = $(this).data("addressid");
                var oldaddressId = $("#addr-addressid").val();
                if (oldaddressId != addressid) {

                    $(".addr-name").empty().html(name + "(" + phone + ")");
                    $(".addr-details").empty().html(address);

                    $("#addr-name").val(name);
                    $("#addr-address").val(address);
                    $("#addr-addressid").val(addressid);
                    //SaveShoppingAddress.call(this, addressid);
                }

                $("#order-details").toggle()
                $("#address-list").toggle();
                $(window).scrollTop(0);
                //$(".cfm-addr-bar").click(AddressChosenClick);
            }
            
          	//加载配送方式
            var LoadShoppingMethods = function () {
                var shoppingmethods = $("#shoppingmethods");
                shoppingmethods.change(ShoppingMethodsChange);
            }
            var ShoppingMethodsChange = function () {
            	//alert("test");
            	var spmId = $("option:selected", this).val(); 
                var gds_total = $("#gds_total").val();
                
                if(spmId!=''){
	                var opt = spmId.split(",") ;
	                var postage = parseFloat(opt[2]);
	                $("#shopping_total").val(postage);
	                var all_money = parseFloat(gds_total) + postage;
	                $("#total").val(all_money);
                }
            }
            
          	//加载支付方式
            var LoadPayMethods = function () {
          		var paymethods = $("#paymethods");
                paymethods.change(PayMethodsChange);
	        }
	        var PayMethodsChange = function () {
	        	var shoppingmethods = $("#shoppingmethods");
	        	if(shoppingmethods.val()=="0,0,0"){
	        		Message("请先选择配送方式");
	        		$("#paymethods").val("");
	        		return;
	        	}
	        	
	        	var fs = ${(session.current_user.front_sign)!0};
	        	
	            var paymethodId = $("option:selected", paymethods).val();
	            if(paymethodId == "1" && fs==1){
	            	//alert($("#front_money").val());
	            	$("#frontMoneyDL").show();
	            	$("#front_money").val(front_money);
	            }
	            //alert(paymethodId);
	        }
            
            $(document).ready(function () {
            	
            	//alert(1);
            	LoadShoppingMethods.apply();//加载配送方式
            	LoadPayMethods.apply();//加载支付方式
            	
            	$("#shoppingmethods").get(0).selectedIndex=1;//索引值
            	setShoppingMethods();
            	
            	/* var frontSign = ${frontSign!}; 	            
	            if(frontSign == 1){ 	            	 	            
	            	//alert(frontSign);
	            	paymethodId = "2";
	            	$("#paymethods option").eq(3).attr("selected", true); 
	            	
	            	$("#frontMoneyDL").show();
	            	$("#front_money").val(front_money);
		            
	            } */
            	
                //LoadOrderTotalDetail.apply();
                $("#gotopay").click(SaveOrder)
                $("#new-address").click(AddAddress);
            })
            
            var SaveOrder = function (e) {
                e.preventDefault();
                //alert("topay");
                var shopId = ${session.session_shop.id!};//商户ID
                
                var addressid = $("#addr-addressid").val();//收货地址ID
                if (addressid == '') {
                    Message("请选择收货地址");
                    return false;
                }
                //Message("测试");
                
                var remark = $("#cfm-message").val();//备注
                
                var postageName = "";//配送名称
                var postage = "";//配送费用
                var shopPostage = $("#shoppingmethods").val();
                if(shopPostage=="0,0,0"){
                	Message("请选择配送方式");
                    return false;
                }else{
                	var sp = shopPostage.split(",") ;
                	postageName = sp[1]
                	postage = parseFloat(sp[2]);
                }
                
                var payment = $("#paymethods").val();//支付方式  (0:在线支付,1:货到付款,2:定金支付)
                if (payment == '') {
                    Message("请选择支付方式");
                    return false;
                }
                
               
                var sel_hour = $("#so_v_sel_hour").val();
                var sel_min = $("#so_v_sel_min").val();
                var nowTime = new Date();
                if (sel_hour != null && sel_hour != ""){
	                var nowHour = nowTime.getHours();
	                var nowMin = nowTime.getMinutes();
	                if (parseInt(sel_hour) == parseInt(nowHour) && parseInt(sel_min) <= parseInt(nowMin)){
	                	Message("订餐时间不能小于当前时间");
	                	return false;
	                }
                }
                else{
                	Message("请选择订餐时间");
                	return false;
                }
                
                var productParam = "${productParams!}";//商品id和数量
                //alert(productParam);
                
                //var gdsTotal = $("#gds_total").val();//商品总价
                var frontMoney = $("#front_money").val();//定金
                if(payment == '2' && frontMoney == '0'){
                	Message("定金支付,支付金额不能为空");
                    return false;
                }
                var allTotal = $("#total").val();//总价=商品总价+运费
                //alert(frontMoney+"----"+allTotal);
                
                var $this = $(this);
                $this.unbind().addClass("disable").empty().html("正在提交...");
                
                var isDelivery = $("input[name='fapiao']:checked").val();//是否需要发票
                //alert(isDelivery);
                var deliveryTime = nowTime.getFullYear() + "-" + (parseInt(nowTime.getMonth()) + 1) + "-" + nowTime.getDate() + " " + sel_hour + ":" + sel_min;
                $.post("/submitOrders/submit", { 
                		"order.shop_id": shopId, "order.customer_address_id": addressid, 
                		"order.remark": remark, "order.postage_name": postageName, "order.postage": postage,
                		"order.payment": payment, "order.front_money": frontMoney, "order.all_money": allTotal,
                		"productParam":productParam,"token":'${token}',"isDelivery":isDelivery,
                		"deliveryTime":deliveryTime
                	}, 
                	function (result) {
                        if (result.Msg === 'Ok') {
                        	delCookie(shop);
                        	delCookie(shopCart);
                        	window.location.href = "/payOrders/view?shopId=${shopPo.id!}&id=" +result.orderPo.id ;
                        	//Message(result.Msg)
                        }else{
                        	Message(result.Msg)
                        }
                        $this.click(AddAddress).removeClass("disable").val("提交订单")
                }).error(AjaxError);
                
            }

            
            var AjaxError = function (e, v) {
                //alert(v);
                //alert(e.message);
            }
			
        })(jQuery);
        
      
    </script>


		<footer class="bottom">
			<div class="bottom-shortcuts layout">
				<ul>
					<#if session?? && session.current_user??>
						<li><i class="login"></i> <a href="/home/logout">退出</a></li>
						<li class="l-spacing"></li>
					<#else>
						<li><i class="login"></i><a href="/home/login">登录</a></li>
						<li class="l-spacing"></li>
						<li><i class="reg"></i><a href="/home/regist">注册</a></li>
					</#if>
					<!-- <li class="fr"><i class="cart"></i><a href="/cart/view/${session.session_shop.id!}">购物车</a></li> -->
				</ul>
			</div>
			<div class="version">
				<span id="backtotop"><a href="javascript:void(0);"><i
						class="gray">▲</i>返回顶部</a></span>
			</div>
		</footer>

	</div>
</body>
</html>
